<template>
  <div id='tmpl'>
      <!-- mui media-list组件 图文列表 -->
      <ul class="mui-table-view">
				<li v-for="itme in list" class="mui-table-view-cell mui-media">
					<router-link v-bind="{to:'/news/newsinfo/'+itme.id}">
						<img class="mui-media-object mui-pull-left" :src="itme.img_url" >
						<div class="mui-media-body">
							{{itme.title}}
							<p class='mui-ellipsis' v-text="itme.zhaiyao"></p>
                            <div class="date">
                                <span>发表时间：{{itme.add_time | datefmt('YYYY-MM-DD hh:mm:ss')}}</span>
                                <span class="click">点击数:{{itme.click}}</span>
                            </div>
						</div>
					</router-link>
				</li>
		</ul>
  </div>
</template>
<script>
import {Toast} from 'mint-ui';
export default {
  data () {
    return {
        list:[]
    }
  },
  created(){
     this.getnewslist();
  },
  methods:{
      getnewslist(){
          var url = this.$common.apidomain + '/api/getnewslist';
          this.$http.get(url).then(function(res){
              var data = res.body;
              //数据格式
                //     {
				// 	  "status": 0,   // 0 :代表的是成功  非0代表的是服务器发生了错误
				// 	  "message": [
				// 		{
				// 		  "id": 13,
				// 		  "title": "1季度多家房企利润跌幅超50% 去库存促销战打响",
				// 		  "add_time": "2015-04-16T03:50:28.000Z",
				// 		  "zhaiyao": "房企一季度销售业绩已经陆续公布，克而瑞研究中心统计",
				// 		  "click": 1,
				// 		  "img_url": "http://www.webhm.top:8080/upload/201504/16/201504161149414479.jpg"
                //         }
                //     ]
                // }
                if(data.status !=0){
                    Toast('列表不存在');
                    return;
                }
                this.list = data.message;
          });
      }
      
  }
}
</script>
<style lang="css" scoped>
.mui-table-view img{
 	height:80px;
 	width:80px;
 }
 .mui-ellipsis{
     font-size: 14px;
     color: blue;
 }

 .mui-table-view .mui-media-object{
	 max-width: 80px;
	 line-height: 80px;
 }
     .date {
         margin-top: 1.5em;
         font-size: 14px;
         color:deeppink;
     }
     .click {
        margin-left: 60px;
     }
</style>